<template>
	<view class="page">
		<view class="title">
			手机验证码登录
		</view>
		<view class="form">
			<view class="row">
				<image class="icon" src="../../static/mobile-icon.png" mode=""></image>
				<input class="mobile" maxlength="11" type="number" value="" placeholder="请输入手机号" placeholder-class="placeholder" />
			</view>
			<view class="row">
				<image class="icon" src="../../static/yanzhengma-icon.png" mode=""></image>
				<input class="code" type="number" value="" placeholder="请输入验证码" placeholder-class="placeholder" />
				<view class="code-btn" @click="getCheckNum()">
					{{!codeTime?'获取验证码':codeTime+'s'}}
				</view>
			</view>
			<view class="login-btn">
				立即登录
			</view>
			<view class="protocol">
				<label>
					<checkbox :checked="isAgree" />我同意小易升学
				</label>
				<navigator url="" hover-class="none">《用户协议》</navigator>
				和
				<navigator url="" hover-class="none">《隐私协议》</navigator>
			</view>
			<view class="register-link">
				<navigator url="../register/register" hover-class="none">注册</navigator>
			</view>
		</view>
		<!-- #ifdef APP-PLUS -->
		<button class="wx-btn" @click="appLogin">
			<image class="icon" src="../../static/weixin-icon.png" mode=""></image>
			微信
		</button>
		<!-- #endif -->
		<!-- #ifdef MP-WEIXIN -->
		<button class="wx-btn" @click="wxLogin">
			<image class="icon" src="../../static/weixin-icon.png" mode=""></image>
			微信
		</button>
		<!-- #endif -->
	</view>
</template>

<script>
	import util from '../../utils/util.js';
	export default {
		data() {
			return {
				isAgree: false, //是否同意
				codeTime: 0,
			}
		},
		methods: {
			//获取验证码
			getCheckNum() {
				let that = this;
				if (that.codeTime > 0) {
					util.toast('不能重复获取');
					return;
				} else {
					console.log('获取验证码')
					that.codeTime = 60;
					let timer = setInterval(() => {
						that.codeTime--;
						if (that.codeTime < 1) {
							clearInterval(timer);
							that.codeTime = 0
						}
					}, 1000)
				}
			},
			// app微信授权登录
			appLogin: function() {
				uni.getProvider({
					service: 'oauth',
					success: function(res) {
						console.log(res.provider);
						//支持微信、qq和微博等
						if (~res.provider.indexOf('weixin')) {
							uni.login({
								provider: 'weixin',
								success: function(loginRes) {
									console.log('-------获取openid(unionid)-----');
									console.log(JSON.stringify(loginRes));
									// 获取用户信息
									uni.getUserInfo({
										provider: 'weixin',
										success: function(infoRes) {
											console.log('-------获取微信用户所有-----');
											console.log(JSON.stringify(infoRes.userInfo));
										}
									});
								}
							});
						}
					}
				});
			},
			// 小程序微信登录
			wxLogin: function() {
				uni.login({
					provider: 'weixin',
					success: function(loginRes) {
						console.log('loginRes',loginRes)
						console.log('-------获取code-------')
						console.log(loginRes.code);
						wx.request({
							url: 'https://xxxxx'+loginRes.code,
							success: function(info) {
								console.log('-------获取sessionKey、openid(unionid)-------')
								console.log(info);
							},
							fail: function(e) {
								console.log(e)
							}
						})
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import 'login.scss';
</style>
